import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:get/get.dart';
import 'package:zrjz/comm/constants/color_constants.dart';
import 'package:zrjz/comm/constants/constants.dart';
import 'package:zrjz/comm/utils/ex_widget.dart';
import 'package:zrjz/comm/widget/dialog/verify_code_dialog/verify_code_dialog_state.dart';
import 'package:zrjz/comm/widget/my_load_image.dart';
import 'package:zrjz/comm/widget/my_text_field.dart';
import 'package:zrjz/comm/widget/my_text_view.dart';
import 'package:zrjz/generated/assets.dart';

import 'verify_code_dialog_controller.dart';

/*
   验证码的弹框，用于发送短信的校验
 */
class VerifyCodeDialog extends StatelessWidget {
  late VerifyCodeDialogController controller;
  late VerifyCodeDialogState state;

  VerifyCodeDialog({super.key, this.cancelAction, this.confirmAction}) {
    controller = Get.put(VerifyCodeDialogController());
    state = controller.state;
  }

  VoidCallback? cancelAction;
  void Function(String? key, String? code)? confirmAction;

  //取消弹框
  void onCancel() async {
    SmartDialog.dismiss(status: SmartStatus.dialog);
  }

  @override
  Widget build(BuildContext context) {
    return OrientationBuilder(
      builder: (BuildContext context, Orientation orientation) {
        if (orientation == Orientation.portrait) {
          // 竖屏
          return _buildDiaologLayout(false, context);
        } else {
          // 横屏
          return _buildDiaologLayout(true, context);
        }
      },
    );
  }

  Widget _buildDiaologLayout(bool isHScreen, BuildContext context) {
    return GetBuilder<VerifyCodeDialogController>(builder: (controller) {
      return Padding(
        padding: isHScreen
            ? EdgeInsets.zero
            : EdgeInsets.only(
                bottom: MediaQuery.of(context).viewInsets.bottom,
              ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            //Title
            Container(
              decoration: BoxDecoration(
                color: DarkThemeUtil.multiColors(ColorConstants.appBlue, darkColor: ColorConstants.darkBlackItemLight),
                borderRadius: const BorderRadius.only(
                  topLeft: Radius.circular(5),
                  topRight: Radius.circular(5),
                ),
              ),
              padding: const EdgeInsets.only(left: 30, right: 10, top: 5, bottom: 5),
              child: Row(
                children: [
                  Expanded(
                    child: MyTextView(
                      "验证码".tr,
                      fontSize: 18,
                      marginTop: 15,
                      marginBottom: 16,
                      isFontMedium: true,
                      textColor: ColorConstants.whitefe,
                      textAlign: TextAlign.center,
                    ),
                  ),
                  //Cancel
                  InkWell(
                    onTap: () {
                      cancelAction?.call();
                      onCancel();
                    },
                    child: MyLoadImage(
                      Assets.imagesDialogDeleteIcon,
                      width: 26,
                      height: 26,
                    ),
                  ),
                ],
              ),
            ),

            DecoratedBox(
              decoration: BoxDecoration(
                color: DarkThemeUtil.multiColors(ColorConstants.white, darkColor: ColorConstants.darkBlackItemLightMost),
                borderRadius: const BorderRadius.only(
                  bottomLeft: Radius.circular(5),
                  bottomRight: Radius.circular(5),
                ),
              ),
              child: Column(
                children: [
                  //code
                  Row(
                    mainAxisSize: MainAxisSize.max,
                    children: [
                      IgnoreKeyboardDismiss(
                        child: MyTextField(
                          'code',
                          state.formData['code']!['value'],
                          enabled: true,
                          fillCornerRadius: 1,
                          padding: const EdgeInsets.symmetric(horizontal: 10),
                          boxBorder: Border.all(
                            color: hexToColor('#BFBFBF'),
                            width: 0.5,
                          ),
                          border: InputBorder.none,
                          showDivider: false,
                          hintText: state.formData['code']!['hintText'],
                          hintStyle: TextStyle(
                            color: DarkThemeUtil.multiColors(ColorConstants.gray82, darkColor: ColorConstants.white),
                            fontSize: 15,
                            fontWeight: FontWeight.w600,
                          ),
                          controller: state.formData['code']!['controller'],
                          focusNode: state.formData['code']!['focusNode'],
                          style: TextStyle(
                            color: DarkThemeUtil.multiColors(ColorConstants.black, darkColor: ColorConstants.white),
                            fontSize: 18,
                            fontWeight: FontWeight.w600,
                          ),
                          height: 48,
                          cursorWidth: 1.5,
                          cursorColor: ColorConstants.tabTextBlack,
                          margin: const EdgeInsets.only(right: 5),
                          onSubmit: (formKey, value) {
                            state.formData[formKey]!['focusNode'].unfocus();
                            confirmAction?.call(state.imageKey, state.formData['code']!['controller'].text);
                            onCancel();
                          },
                        ),
                      ).expanded(),

                      //图片验证码
                      MyLoadImage(
                        state.imgFilePath,
                        width: 100,
                        height: 45,
                        fit: BoxFit.fill,
                        onClick: () => controller.fetchVerifyCodeImg(),
                      ),
                    ],
                  ).marginOnly(left: 19, right: 18.5, top: 24, bottom: 16),

                  //Buttons
                  Row(
                    children: [
                      Expanded(
                          flex: 1,
                          child: InkWell(
                            onTap: () {
                              confirmAction?.call(state.imageKey, state.formData['code']!['controller'].text);
                              onCancel();
                            },
                            child: MyTextView(
                              "发送验证码".tr,
                              marginLeft: 10,
                              paddingTop: 10,
                              paddingBottom: 10,
                              fontSize: 16,
                              isFontMedium: true,
                              marginRight: 20,
                              marginBottom: 35,
                              textAlign: TextAlign.center,
                              textColor: ColorConstants.white,
                              backgroundColor: ColorConstants.blue1578fe,
                              cornerRadius: 3,
                            ),
                          )),
                    ],
                  ),
                ],
              ),
            ),
          ],
        ),
      );
    }).constrained(width: 295);
  }
}
